<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'header.php'?>
<style type="text/css">
	#dynamic-table .coach-class {word-break: break-all;white-space: pre-wrap;width: 40% !important;}
	.img-outer {
		display: flex;
		flex-wrap: wrap;
	}
	#dynamic-table img {
		cursor: pointer;
		margin: 10px;
	}
	#cboxClose {
		text-indent: 0;
		font-size: 50px;
		font-weight: bold;
		margin-top: 10px;
		color: red;
	}
	.div-date-picker {
		position: relative;
	}
	#date-picker {
		width: 168px;
		padding-left: 30px;
	}
	.div-date-picker .fa-calendar{
		position: absolute;
		left: 8px;
		top: 9px;
	}
</style>
<div class="page-header">
	<h1>
		执教关系
		<!-- 同步学校不可修改 -->
		<?php if($rmxSchool['school_from'] != X_DATA_HAOZHUANYE): ?>
			<!-- 学校管理员权限才能编辑 -->
			<?php if($rmxUser['user_type'] == USER_TYPE_SCHOOL): ?>
				<a href="<?=admin_url('staff/coach_edit')?>" class="btn btn-info a-custom">
					<i class="ace-icon fa fa-plus"></i> 新增关系
				</a>
				<span class="dropdown dropdown-custom">
					<div class="btn btn-info btn-dropdown"  data-toggle="dropdown">
						<i class="ace-icon fa fa-database"></i> 模板导入与导出&nbsp;&nbsp;<i class="ace-icon fa fa-caret-down"></i>
					</div>
					<ul class="dropdown-menu">
						<li>
							<a href="javascript:" id="import">
								<i class="ace-icon fa fa-upload"></i> 导入任课教师数据
							</a>
						</li>
						<li>
							<a id="export">
								<i class="ace-icon fa fa-download"></i> 导出任课教师数据模板
							</a>
						</li>
						<li>
							<a href="javascript:" id="import_master">
								<i class="ace-icon fa fa-upload"></i> 导入班主任数据
							</a>
						</li>
						<li>
							<a id="export_master">
								<i class="ace-icon fa fa-download"></i> 导出班主任数据模板
							</a>
						</li>
					</ul>
				</span>
			<?php endif ?>
		<?php endif ?>
	</h1>
</div>
<div class="col-xs-12 content-filter">
	<div class="widget-box">
		<div class="widget-header" style="vertical-align:middle;">
			<h4 class="widget-title">
				内容筛选
			</h4>
			<div class="widget-toolbar">
				<a href="#" data-action="collapse">
					<i class="ace-icon fa fa-chevron-up"></i>
				</a>
				<a href="#" data-action="close">
					<i class="ace-icon fa fa-times"></i>
				</a>
			</div>
		</div>
		<div class="widget-body">
			<div class="widget-main">
				<div class="form-inline keyword-search-div">
					<label class="keyword-search-label">名称&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
					<div class="keyword-search-box">	
                        <input style="float:left;height:30px;width:220px;border:1px solid #669FC7;padding:0 30px 0 14px;border-radius:10px 0 0 10px !important;-moz-border-radius:10px 0 0 10px;" type="text" name="realname" placeholder="搜索教师名称..." autocomplete="off">
                        <span id="empty-search" style="position:relative;right:64px;cursor:pointer;display:none;">×</span>
                        <button id="btn-search" class="btn-search" style="outline:none;float:left;height:30px;width:44px;border:1px solid #669FC7;background-color:#669FC7;border:0;border-radius:0 10px 10px 0;-moz-border-radius:0 10px 10px 0;">
                            <i class="ace-icon fa fa-search nav-search-icon white"></i>
                        </button>
					</div>
                </div>
                <div class="form-inline keyword-search-div" id="div-grade">
                    <label class="keyword-search-label">年级&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                    <div class="keyword-search-box">
                        <a href="javascript:;" class="keyword-search-keyword keyword-search-grade active" data-id="">全部</a>
                        <?php if(isset($gradeList)): ?>
                            <?php foreach($gradeList as $grade): ?>
                                <a href="javascript:;" class="keyword-search-keyword keyword-search-grade"  data-id="<?=$grade['id']?>"><?=$grade['grade_name']?></a>
                            <?php endforeach; ?>
                        <?php endif ?>
                    </div>
                </div>
                <div class="form-inline keyword-search-div" id="div-normal-class">
                    <label class="keyword-search-label">班级&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                    <div class="keyword-search-box">
                        <a href="javascript:;" class="keyword-search-keyword keyword-search-normal-class active" data-id="">全部</a>
                    </div>
                </div>
                <div class="form-inline keyword-search-div">
					<label class="keyword-search-label">角色&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
					<div class="keyword-search-box" id="div-type">
						<a href="javascript:;" class="keyword-search-keyword active" data-value="0">全部</a>
						<?php foreach($coachTypeArr as $coachType): ?>
							<a href="javascript:;" class="keyword-search-keyword" data-value="<?=$coachType['value']?>"><?= $coachType['title'] ?></a>
						<?php endforeach; ?>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="col-xs-12">
	<table id="dynamic-table" class="table table-striped table-bordered table-hover" style="margin-top:10px">
		<thead>
			<tr>
				<th>教师名称</th>
				<th>执教角色</th>
				<th class="coach-class">执教班级</th>
				<th>执教科目</th>
				<th>管理年级</th>
				<th>创建时间</th>
				<th width="18%">操作</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
	</table>
</div>
<?php require VIEWPATH. ADMIN_DIR. DIRECTORY_SEPARATOR. 'footer.php'?>
<script type="text/javascript">
	$(function(){
        // 班级数据
		var normalClassJson = <?= $gradeNormalClassList ?>;
		// 执教关系表格
		var table = $('#dynamic-table').dt({
			"ajaxUrl": '<?=admin_url('staff/get_coach_list')?>',
			"columns": [
                {"data": "realname"},
                {"data": "coach_type_chinese"},
                {"data": "class_name"},
				{"data": "subject_name"},
				{"data": "grade_name"},
	            {"data": "createtime"},
                {"data": function(ret){
					var action = '';
					// 学校管理员权限才能编辑
					<?php if($rmxUser['user_type'] == USER_TYPE_SCHOOL): ?>
						// 同步学校不可修改
						<?php if($rmxSchool['school_from'] != X_DATA_HAOZHUANYE): ?>
							action += '<a class="edit-coach green mr20" href="<?= admin_url('staff/coach_edit/') ?>' + ret.id + '"><i class="fa fa-edit"></i> 修改</a>';
							action += '<a class="text-danger delete-coach" href="javascript:" data-id=' + ret.id +  ' data-title=' + ret.realname + '><i class="fa fa-times"></i> 删除</a>';
						<?php endif ?>
					<?php endif ?>
          
                    return action;
                }}
			]
		});
		// 内容筛选
		$("#data-search-btn").click(function(){
			search(table);
		})
		// 点击关键字
		$("body").on("click", ".keyword-search-keyword", function(){
			var id = $(this).data("id");
			// 高亮当前点击对象
			$(this).parent().find(".keyword-search-keyword").removeClass("active");
			$(this).addClass("active");
			// 如果是点击年级
			if($(this).hasClass("keyword-search-grade")) {
				// 先清空班级列表
				$(".keyword-search-normal-class:gt(0)").remove();
				// 获取班级列表
				var normalClassList = normalClassJson[id];
				for(var i in normalClassList) $(".keyword-search-normal-class:first").parent().append('<a href="javascript:;" class="keyword-search-keyword keyword-search-normal-class" data-id="'+ normalClassList[i].id +'">'+ normalClassList[i].name +'</a>');
				// 选中全部班级
				var realname = $("[name=realname]").val();
				var gradeId = $("#div-grade .active").data("id");
				search(table);
			} else {
				search(table);
			}
		});
		// 敲回车就搜索
		$("[name=realname]").keypress(function (e) {
                if (e.which == 13) {
                    $("#btn-search").trigger("click");
                }
		});
		// 清空搜索框
		$("[name=realname]").keyup(function() {
			if($(this).val().length > 0) {
				$("#empty-search").show();
				$("#empty-search").click(function(){
					$("[name=realname]").val('');
					$(this).hide();
					// 重置搜索结果
					search(table);
				})
			} else {
				$("#empty-search").hide();
			}
		}); 
		// 搜索标题
		$("#btn-search").click(function() {
			search(table);
		});

		// 保存执教关系按钮
		var coachForm = $("#coach-form");
		$("#save-coach").click(function(){
			coachForm.submit();
		})
		var submitUrl = "<?=admin_url('moral/save_coach_action')?>";
		form_submit(coachForm, submitUrl, function(res) {
			tips_alert(res.msg, res.success, function(){
				if(res.success) window.location.reload();
			});
		})
		// 删除执教关系
		$("body").on('click', '.delete-coach', function() {
			var id = $(this).data('id');
			var title = $(this).data('title');
			var posturl = "<?= admin_url("staff/delete_coach_action") ?>";
			var data = {
				'id': id
			};
			layer.confirm('确定删除：' + title + '的执教关系？', { title:"提示", offset: '160px' }, function(){
				ajax_post(posturl, data, function() {
					// 刷新页面
					window.location.reload();
				});
			});
		});
		// 导出班牌班级数据
		$("#export").click(function() {
			$url = "<?=admin_url('staff/export_teacher_coach')?>";
			window.location.href  = $url;
		});
		// 导入班牌所属班级
		var upFromurl = '<?=UP_FORM_URL?>';
		var signature = '<?=$signature?>';
		var policy = '<?=$policy?>';
		$("#import").uploader({
			"server": upFromurl,
			"authorization": signature,
			"policy": policy,
			// 只支持上传 xls
			"accept": "xls",
			"callback": function(response) {
				// 上传后的文件名
				var fileLink = upyunUrl + response.url;
				ajax_post("<?= admin_url('import/import_teacher_coach') ?>", { fileLink: fileLink}, function(res) {
					// 刷新页面
					location.reload();
				});
			}
		});
		// 设置选择文件按钮大小
		setTimeout(function(){
			$(".webuploader-pick").next().width(158).height(32);
		}, 100);
		// 导出班主任数据
		$("#export_master").click(function() {
			$url = "<?=admin_url('staff/export_master_coach')?>";
			window.location.href  = $url;
		});
		$("#import_master").uploader({
			"server": upFromurl,
			"authorization": signature,
			"policy": policy,
			// 只支持上传 xls
			"accept": "xls",
			"callback": function(response) {
				// 上传后的文件名
				var fileLink = upyunUrl + response.url;
				ajax_post("<?= admin_url('import/import_master_coach') ?>", { fileLink: fileLink}, function(res) {
					// 刷新页面
					location.reload();
				});
			}
		});
		// 设置选择文件按钮大小
		setTimeout(function(){
			$(".webuploader-pick").next().width(158).height(32);
		}, 100);
	})
	function search(table, timeStr='') {
		if(timeStr == '') {
			timeStr = $("#work-calendar").text();
		}
		var timeArr = [];
		var beginTime = '';
		var endTime = '';
		if(timeStr.indexOf(" - ") != -1) {
			timeArr = timeStr.split(" - ");
			beginTime = timeArr[0] + ' 00:00:00';
			endTime = timeArr[1] + ' 23:59:59';
		}

		table.setAjaxData({
			"grade_id": $("#div-grade .active").data('id'),
			"class_id": $("#div-normal-class .active").data('id'),
			"realname": $("[name=realname]").val(),
			"coach_type": $("#div-type .active").data('value')
		});
	}
</script>